<template>
  <div class="account">
    <home-page-top/>
    <div class="ind-wd-guid">
        <div class="ind-wd-guid-item">
            <a href="javascript:void(0)" @click="activeTab = 'sum'"><span :class="{'ind-wd-guid-se':activeTab === 'sum'}">中亿账户</span></a>
        </div>
        <div class="ind-wd-guid-item">
            <a href="javascript:void(0)" @click="activeTab = 'info'"><span :class="{'ind-wd-guid-se':activeTab === 'info'}">基本信息</span></a>
        </div>
        <div class="ind-wd-guid-item">
            <a href="javascript:void(0)" @click="activeTab = 'safety'"><span :class="{'ind-wd-guid-se':activeTab === 'safety'}">安全中心</span></a>
        </div>
    </div>
    <transition name="slideRightInLeftOut" mode="out-in">
      <component :is="view"></component>
    </transition>
  </div>
</template>
<script>
import HomePageTop from '@/components/home-page-top'
import Sum from './sum'
import Info from './info'
import Safety from './safety'
export default {
  title: '用户中心-个人账户',
  data () {
    return {
      dataPoints: null,
      activeTab: 'sum',
      viewList: {
        sum: Sum,
        info: Info,
        safety: Safety
      },
      height: 20
    }
  },
  components: {
    HomePageTop,
    Sum,
    Info,
    Safety
  },
  computed: {
    view () {
      return this.viewList[this.activeTab]
    },
    curTab () {
      return this.$route.query.type
    }
  },
  created () {
    if (this.curTab) {
      this.activeTab = this.curTab
    }
  },
  methods: {}
}
</script>
<style lang="scss">
.account {
}
</style>
